<template>
  <div id="contentRight">
    <section id="sec1">
      <p class="guide">
        <router-link to="/safeCenter">账户安全&nbsp;&nbsp;>&nbsp;</router-link>
        <span>实名认证</span>
      </p>
      <div v-if="relNamePass == 1" class="auditBox auditPass">
        <p class="p1">
          <img src="../common/imgs/radiusSuccess.png" alt="">
        </p>
        <p class="p2">您的实名信息已通过认证</p>
        <div class="auditMsg">
          <p>
            <span>证件类型：</span>
            <span>{{data.cardType}}</span>
          </p>
          <p>
            <span>证件号：</span>
            <span>{{data.id_num}}</span>
          </p>
          <p>
            <span>姓名：</span>
            <span>{{data.name}}</span>
          </p>
        </div>
      </div>
      <div v-if="relNamePass == -1" class="auditBox auditIn">
        <p class="p1">
          <img src="../common/imgs/auditIn.png" alt="">
        </p>
        <p class="p2">审核中</p>
        <p class="p3">请等待1~3个工作日进行审核</p>
      </div>
      <div v-if="relNamePass == 0" class="auditBox auditFail">
        <p class="p1">
          <img src="../common/imgs/radiusGth.png" alt="">
        </p>
        <p class="p2">您的实名信息未通过</p>
        <p class="p3">失败原因:{{data.admin_remark}}</p>
        <p class="p4">
          <router-link to="/relNameVerification">重新认证</router-link>
        </p>
      </div>
    </section>
  </div>
</template>
<script>
  import { isRelNameVerify } from '../http/api'
  export default{
    name : 'verificationResult',
    data(){
      return{
        relNamePass : 100,  //实名认证:0 未通过， 1 已通过， -1 审核中  2未实名审核
        data : {},  //实名信息
      }
    },
    mounted() {
      let thiz = this;
      isRelNameVerify({noToast : true}).then( res => {
        let code = Number( res.code );
        let data = res.data;
        switch(code){
          case 609:
            thiz.relNamePass = 2 ; break;
          case 602:
            thiz.relNamePass = -1 ; break;
          case 614:
            thiz.relNamePass = 0 ; break;
          case 200:
            thiz.relNamePass = Number(data.status);
            break;
        }
        let type = Number(data.type);
        //`type` tinyint(4) DEFAULT '1' COMMENT '证件类型 1身份证 2护照 3台胞证 4海外驾照'
        switch (type) {
          case 1:
            data.cardType = '身份证';
            break;
          case 2:
            data.cardType = '护照';
            break;
          case 3:
            data.cardType = '台胞证';
            break;
          case 4:
            data.cardType = '海外驾照';
            break;
        }
        thiz.data = data;
      })
    }
  }
</script>
<style lang="less" scoped>
  @import "../common/style/common";
  @import "../common/style/public.css";
  #sec1{
    min-height: 725px;
    >.auditBox{
      text-align: center;
      &.auditPass{
        padding-top: 179px;
        >.p1{
          >img{
            width: 50px;height: 50px;
          }
        }
        >.p2{
          .colorYellow;font-size: 20px;padding-top: 14px;
        }
        >.auditMsg{
          width: 443px;margin: 0 auto;background: #FAFAFA;.borderRadius(2px);min-height: 140px;margin-top: 28px;
          >p{
            overflow: hidden;padding-top: 22px;
            &:first-child{
              padding-top: 26px;
            }
            >span{
              display: inline-block;
              &:first-child{
                width: 159px;float: left;text-align: right;color: #999;font-size: 16px;
              }
              &:nth-child(2){
                width: 167px;float: right;text-align: left;color: #262626;font-size: 16px;
              }
            }
          }
        }
      }
      &.auditIn{
        padding-top: 265px;
        >.p1{
          img{
            width: 93px;
          }
        }
        >.p2{
          font-size: 18px;color: #585858;padding-top: 21px;
        }
        >.p3{
          font-size: 14px;padding-top: 19px;color: #999;
        }
      }
      &.auditFail{
        padding-top: 179px;
        >.p1{
          >img{
            width: 50px;height: 50px;
          }
        }
        >.p2{
          .colorYellow;font-size: 20px;padding-top: 14px;
        }
        >.p3{
          font-size: 18px;color: #999;padding-top: 19px;
        }
        >.p4{
          padding-top: 30px;
          >a{
            .submit;height: 38px;line-height: 38px;width: 180px;font-size: 14px;color: #fff;
          }
        }
      }
    }
  }
</style>
